<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>天下行租车</title>
    <script src="http://47.106.66.89:8080/js/vue.min.js"></script>
    <script src="http://47.106.66.89:8080/js/axios.min.js"></script>
    <link  href="http://47.106.66.89:8080/js/ele-2.15.7/theme-chalk/index.css" rel="stylesheet">
    <script src="http://47.106.66.89:8080/js/ele-2.15.7/index.js"></script>
    <script src="js/txx.js"></script>
    <script src="js/login.js"></script>
    <link rel="stylesheet" href="css/base.css">
</head>
<body>
<div id="app">
    <txx></txx>
    <main class="c900 el-card" style="align-items: stretch; width: 600px; padding: 30px 50px">
        <h2>用户注册</h2>
        <el-form label-width="80px" label-position="left">
            <el-form-item label-width="0px" style="margin-bottom: 0px">
                <div class="flex" style="align-items: stretch">
                    <el-form label-width="80px" label-position="left" style="width:340px">
                        <el-form-item label="账号: ">
                            <el-input placeholder="账号" v-model="form.username"></el-input>
                        </el-form-item>
                        <el-form-item label="新密码: ">
                            <el-input type="password" placeholder="密码" v-model="form.pwd"></el-input>
                        </el-form-item>
                        <el-form-item label="确认密码: ">
                            <el-input type="password" placeholder="确认密码" v-model="form.repwd"></el-input>
                        </el-form-item>
                    </el-form>
                </div>
            </el-form-item>
            <el-form-item label="邮箱: ">
                <el-input placeholder="邮箱" v-model="form.email"></el-input>
            </el-form-item>
            <el-form-item label="验证码: ">
                    <el-input placeholder="验证码" v-model="form.code" style="width: 200px"></el-input>
                    <el-button type="primary" @click="send">发送验证码</el-button>
            </el-form-item>

            <el-form-item style="text-align: right; margin-right: 10px">
                <el-button type="primary" @click="reSetPwd">修改</el-button>
            </el-form-item>
        </el-form>
    </main>
</div>
<script>
    var v = new Vue({
        el : "#app",
        data : {
            form:{
                username:"",
                pwd:"",
                repwd:"",
                code:""
            },
        },
        created:{},
        methods : {
            reSetPwd(){
                let p = new URLSearchParams()
                p.append("ename", this.form.username);
                p.append("vcode", this.form.code);
                p.append("pwd", this.form.pwd);
                p.append("repwd", this.form.repwd);
                axios.post("txxUser/reSetPwd", p).then(res=>{
                    if (res.data.code == 1) {
                        this.$message(res.data.msg)
                    }else{
                        this.$alter(res.data.msg)
                    }
                })
            },
            send(){
                axios.get("vcode/email",{
                    params:{
                        email:this.form.email,
                        msgName: 'forgetPwd',
                    }
                }).then(res=>{
                    if (res.data.code == 1) {
                        this.$message(res.data.msg)
                    }else{
                        this.$alert(res.data.msg)
                    }
                })
            },

        }
    })
</script>
</body>
</html>
<style>
    .el-form-item .el-form-item {
        margin-bottom: 22px
    }
</style>
